<%@page contentType="text/html;charset=UTF-8"%>
<%@ include file="/commons/taglibs.jsp"%>
<html>
  <head>
    <%@ include file="/commons/meta.jsp"%>
	<link href="resources/dwz/themes/css/login.css" rel="stylesheet" type="text/css" />
	<script src="resources/dwz/js/jquery-1.7.1.js" type="text/javascript"></script>
	<script type="text/javascript">
    $(function(){
        $('#kaptchaImage').click(function () {
        	  $(this).hide().attr('src', '${ctx}/captcha/image?' + Math.floor(Math.random()*100) ).fadeIn();  
        });
 		
        $("#loginForm").submit(function(){
	        login();
	        return false;
	    });
        
        $("#login_login").attr("disabled",false);
    	$("#login_cancel").attr("disabled",false);

    	function login()
    	{
    		var userId = $("#login_userId").val();
    		var password = $("#login_password").val();
    		if (userId == "")
    		{
    		    $("#confirm").text("请输入登录用户名");
    		    $("#login_userId").focus();
    		    return false;
    		}
    		if(password == "")
    		{
    		    $("#confirm").text("请输入登录密码");
    		    $("#login_password").focus();
    		    return false;
    		}
    		$.ajax({
    		    type: "POST",
    		    url: "${ctx}/enter",
    		    data: $("#loginForm").serialize(),
    		    beforeSend: function(){
    		    	$("confirm").text("登录中，请稍候......");
    		    	$("#login_login").attr("disabled",true);
    		    	$("#login_cancel").attr("disabled",true);
    		    },
    		    success: function(data){
    		    	var massage = data.success;
    			    if(massage == true){
    			        $("#confirm").text("登录成功，欢迎" + userId + "回来！正在进入DM......");
    			        window.location.href='${ctx}/main'
    			    }else {
    			
    			   // $('#kaptchaImage')。attr('src', '${ctx}/captcha/image?' + Math.floor(Math.random()*100) );
    			    	$("#confirm").text("登录失败");
    			    	$('#kaptchaImage')。attr('src', '${ctx}/captcha/image?' + Math.floor(Math.random()*100) ;
    			    	$('#loginForm')[0].reset() ;
    			    	$("#login_login").attr("disabled",false);
    			    	$("#login_cancel").attr("disabled",false);
    			    }
    		    }
    		});
    	}
        
    });
</script>	
</head>
<body>
	<div class="login">
		<p class="login-title">登&nbsp;&nbsp;录</p>
		<div id="login_content" class="login_content">
			<form id="loginForm">
				<p>
					<label>用户名称：</label>
				</p>
				<p>
					<input id=login_userId name="username" type=text value="">
				</p>
				
				<p>
					<label>登录密码：</label>
				</p>
				<p>
					<input id=login_password name="password" type=password value="">
				</p>
				
				<p>
					<label>验证码：</label>
				</p>
				<p>
					<input id=login_password name="randcode" type=password value="">
					<img src="${ctx}/captcha/image"  id="kaptchaImage" alt="" width="75" height="24" />
				</p>
				<p>
					<button id="login_login"  type="button">登录</button>
					<button id="login_cancel" type="reset">取消</button>
				</p>
				
			</form>
		</div>
		<div id="confirm" style="color: red; vertical-align: top;text-align: center;margin: 0"></div>
	</div>
	
</body>	
</html>